// 监听元素交叉状态 IntersectionObserver
// https://developer.mozilla.org/zh-CN/docs/Web/API/IntersectionObserver

import { useEffect } from 'react';

let observer;

export default (ele, callback, watch = []) => {
  useEffect(() => {
    const node = document.querySelector(ele);

    if (node) {
      observer = new IntersectionObserver(entries => {
        callback && callback(entries);
      });
      // 开始监听一个目标元素。
      observer.observe(node);
    }

    return () => {
      if (observer && node) {
        // 停止监听特定目标元素。
        observer.unobserve(node);

        // 对象停止监听工作。
        observer.disconnect();
      }
    };
  }, watch);
};
